<template>
  <div>
    <el-table v-loading="!rewardData" :data="rewardData">
      <el-table-column label="名称" prop="name" />
      <el-table-column label="描述" prop="description" />
      <el-table-column label="创建时间" prop="create" />
      <el-table-column fixed="right" label="操作" width="200">
        <template slot-scope="scope">
          <el-button size="mini" @click="handleEditReward(scope.row)">编辑</el-button>
          <el-button size="mini" type="danger" @click="handleDeleteReward(scope.row)">删除</el-button>
        </template>
      </el-table-column>
    </el-table>
  </div>
</template>

<script>
export default {
  name: 'RewardRecord',
  props: {
    data: { type: Object, default: null }
  },
  data: () => ({
    tableLoading: false,
    rewardItem: null,
    rewardData: null
  }),
  watch: {
    data: {
      handler(val) {
        if (val) {
          this.rewardItem = val
          this.refreshConfig()
        }
      },
      immediate: true
    }
  },
  methods: {
    refreshConfig() {
      this.rewardData = this.rewardItem.children
    },
    handleEditReward(row) {
      this.$emit('handleEditReward', row)
    },
    handleDeleteReward(row) {
      this.$emit('handleDeleteReward', row)
    }
  }
}
</script>
